<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .btn1{
            width: 150px;
            height: 40px;
            font-size: 24px;
            font-family: 隶书;
            background-color: yellow;
            color: rgb(110, 2, 2);
            border: 3px solid rgb(110, 2, 2);
            border-radius: 5px;
        }
    </style>
    <!--
        引入方式
        1 内嵌式    在head中通过一对script标签定义脚本代码
        2 引入外部脚本文件
        注意：
            1 一个html中可以有多个script标签
            2 一对script标签不能在引入外部js文件的同时定义内部脚本
            3 script标签如果用于引入外部js文件,中间最好不要有任何字符 包括空格和换行
    
    -->
<!--        <script>
         /*
         1 js 如何声明函数？    java中的函数    public void suprise(){}
         2 函数如何和单击按钮的行为绑定到一起？
         3 如何弹窗提示
         */
        function suprise(){
            //弹窗提示
            alert("hello 我是惊喜")
        }   
        </script>-->
        
        <script src="js/button.js" type="text/javascript"></script>

        <Script>
            function sayhello(){
                alert("hello js")
            }
        </Script>
</head>

<body>
  <button class="btn1" onclick="suprise()">点我有惊喜</button>  
  <button class="btn1" onclick="sayhello()">sayhello</button>  
</body>
</html>